<!DOCTYPE html>
<html>

<head>
    <meta charset='utf-8'>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="renderer" content="webkit" />
    <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=0" />
    <title>Hello World!</title>
    <link rel='stylesheet' href='./luckysheet/plugins/css/pluginsCss.css' />
    <link rel='stylesheet' href='./luckysheet/plugins/plugins.css' />
    <link rel='stylesheet' href='./luckysheet/css/luckysheet.css' />
    <link rel='stylesheet' href='./luckysheet/assets/iconfont/iconfont.css' />

    <script src="https://cdn.bootcdn.net/ajax/libs/babel-polyfill/6.26.0/polyfill.min.js"></script>
    <script src="./exceljs/exceljs.min.js"></script>
    <script src="./luckysheet/plugins/js/plugin.js"></script>
    <script src="./luckysheet/luckysheet.umd.js"></script>
    <script src="./editor.js"></script>
    <script>
        $(function () {
            if(MRichEditor && MRichEditor.getData && MRichEditor.getData()){
                initLuckysheet(JSON.parse(MRichEditor.getData()));
            }
            else if(MRichEditor && MRichEditor.getFileBase64 && MRichEditor.getFileBase64()){
                initLuckysheetFromFileBase64(MRichEditor.getFileBase64(),"haha");
            }else {
                initLuckysheet(null);
            }
        });
    </script>
</head>

<body>
    <div id="luckysheet"
        style="margin:0px;padding:0px;position:absolute;width:100%;left: 0px;top: 0px;bottom: 0px;outline: none;">
    </div>
    <script src="luckyexcel.umd.js"></script>
    <script>
        function demoHandler() {
            let upload = document.getElementById("Luckyexcel-demo-file");
            let selectADemo = document.getElementById("Luckyexcel-select-demo");
            let downlodDemo = document.getElementById("Luckyexcel-downlod-file");
            let saveDemo = document.getElementById("Luckyexcel-save-file");
            let mask = document.getElementById("lucky-mask-demo");
            if (upload) {

                window.onload = () => {

                    upload.addEventListener("change", function (evt) {
                        var files = evt.target.files;
                        if (files == null || files.length == 0) {
                            alert("No files wait for import");
                            return;
                        }

                        let name = files[0].name;
                        let suffixArr = name.split("."), suffix = suffixArr[suffixArr.length - 1];
                        if (suffix != "xlsx") {
                            alert("Currently only supports the import of xlsx files");
                            return;
                        }
                        LuckyExcel.transformExcelToLucky(files[0], function (exportJson, luckysheetfile) {

                            if (exportJson.sheets == null || exportJson.sheets.length == 0) {
                                alert("Failed to read the content of the excel file, currently does not support xls files!");
                                return;
                            }
                            console.log(exportJson, luckysheetfile);
                            window.luckysheet.destroy();

                            window.luckysheet.create({
                                container: 'luckysheet', //luckysheet is the container id
                                showinfobar: false,
                                data: exportJson.sheets,
                                title: exportJson.info.name,
                                userInfo: exportJson.info.name.creator
                            });
                        });
                        // LuckyExcel.transformExcelToLucysheet(files[0],function(lkfile){
                        //     if (lkfile.sheets == null || lkfile.sheets.length == 0) {
                        //         alert("Failed to read the content of the excel file, currently does not support xls files!");
                        //         return;
                        //     }
                        //     console.log(lkfile);
                        //     window.luckysheet.destroy();

                        //     window.luckysheet.create({
                        //         container: 'luckysheet', //luckysheet is the container id
                        //         showinfobar: false,
                        //         data: lkfile.sheets,
                        //         title: lkfile.info.name,
                        //         userInfo: lkfile.info.name.creator
                        //     });
                        // });
                    });

                    selectADemo.addEventListener("change", function (evt) {
                        var obj = selectADemo;
                        var index = obj.selectedIndex;
                        var value = obj.options[index].value;
                        var name = obj.options[index].innerHTML;
                        if (value == "") {
                            return;
                        }
                        mask.style.display = "flex";
                        LuckyExcel.transformExcelToLuckyByUrl(value, name, function (exportJson, luckysheetfile) {

                            if (exportJson.sheets == null || exportJson.sheets.length == 0) {
                                alert("Failed to read the content of the excel file, currently does not support xls files!");
                                return;
                            }
                            console.log(exportJson, luckysheetfile);
                            mask.style.display = "none";
                            window.luckysheet.destroy();

                            window.luckysheet.create({
                                container: 'luckysheet', //luckysheet is the container id
                                showinfobar: false,
                                data: exportJson.sheets,
                                title: exportJson.info.name,
                                userInfo: exportJson.info.name.creator
                            });
                        });
                    });

                    downlodDemo.addEventListener("click", function (evt) {
                        var obj = selectADemo;
                        var index = obj.selectedIndex;
                        var value = obj.options[index].value;

                        if (value.length == 0) {
                            alert("Please select a demo file");
                            return;
                        }

                        var elemIF = document.getElementById("Lucky-download-frame");
                        if (elemIF == null) {
                            elemIF = document.createElement("iframe");
                            elemIF.style.display = "none";
                            elemIF.id = "Lucky-download-frame";
                            document.body.appendChild(elemIF);
                        }
                        elemIF.src = value;
                    });

                    saveDemo.addEventListener("click", function (evt) {
                        LuckyExcel.transformLucyToExcelBase64(window.luckysheet.toJson(), function (filebase64) {

                        })
                    });
                }
            }
        }
        demoHandler();
    </script>
</body>

</html>